<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>xlsx</title>
    <style>
        td {
            font-size: 40px;
            background: linear-gradient(to bottom, white, black);
            -webkit-text-fill-color: transparent;
            -webkit-background-clip: text;
        }
    </style>
    <script src="http://oss.sheetjs.com/js-xlsx/xlsx.full.min.js"></script>
    <!-- 读取xlsx -->
    <script src="readXlsx.js"></script>
    <!-- 导出xlsx -->
    <script src="getXlsx.js"></script>
</head>

<body>
    <h1>xlsx 读取和导出</h1>

    <fieldset>
        <legend>读取xlsx文件</legend>
        <p>读取格式后为json</p>
        <input type="file" id="file" />
        <script>
            document.querySelector("#file").addEventListener('change', function () {
                var f = this.files[0];
                readXlsx(f).then((d) => {
                    console.log(d)
                })

            })
        </script>
    </fieldset>

    <fieldset>
        <legend>导出xlsx</legend>
        <p>将json 转换成xlsx</p>
        <button onclick="downloadExl(jsono)">导出</button>

        <!--
                以下a标签不需要内容
            -->
    </fieldset>

    <script>
        var jsono = [{ //测试数据
            "保质期临期预警(天)": "adventLifecycle",
            "商品标题": "title",
            "建议零售价": "defaultPrice",
            "高(cm)": "height",
            "商品描述": "Description",
            "保质期禁售(天)": "lockupLifecycle",
            "商品名称": "skuName",
            "商品简介": "brief",
            "宽(cm)": "width",
            "阿达": "asdz",
            "货号": "goodsNo",
            "商品条码": "skuNo",
            "商品品牌": "brand",
            "净容积(cm^3)": "netVolume",
            "是否保质期管理": "isShelfLifeMgmt",
            "是否串号管理": "isSNMgmt",
            "商品颜色": "color",
            "尺码": "size",
            "是否批次管理": "isBatchMgmt",
            "商品编号": "skuCode",
            "商品简称": "shortName",
            "毛重(g)": "grossWeight",
            "长(cm)": "length",
            "英文名称": "englishName",
            "净重(g)": "netWeight",
            "商品分类": "categoryId",
            "这里超过了": 1111.0,
            "保质期(天)": "expDate"
        },
        { //测试数据
            "保质期临期预警(天)": "12",
   
            "建议零售价": "defaultPrice",
            "高(cm)": "height",
            "商品描述": "Description",
            "保质期禁售(天)": "lockupLifecycle",
            "商品名称": "skuName",
            "商品简介": "brief",
            "宽(cm)": "width",
            "阿达": "asdz",
            "货号": "goodsNo",
            "商品条码": "skuNo",
            "商品品牌": "brand",
            "净容积(cm^3)": "netVolume",
            "是否保质期管理": "isShelfLifeMgmt",
            "是否串号管理": "isSNMgmt",
            "商品颜色": "color",
            "尺码": "size",
            "是否批次管理": "isBatchMgmt",
            "商品编号": "skuCode",
            "商品简称": "shortName",
            "毛重(g)": "grossWeight",
            "长(cm)": "length",
            "英文名称": "englishName",
            "净重(g)": "netWeight",
            "商品分类": "categoryId",
            "这里超过了": 1111.0,
            "保质期(天)": "expDate"
        }];
    </script>
</body>

</html>